import React, { Component, PropTypes } from 'react';
import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
import { Icon } from '../icon'

class LabelBar extends Component {
    static propTypes = {
        title: PropTypes.string.isRequired,
        disableIcon: PropTypes.bool,
        disablePress: PropTypes.bool,
        onPress: PropTypes.func,
    };

    static defaultProps = {
      iconColor: '#999999',
      iconSize: 16
    }

    render () {
        const { title, titleStyle, value, style, containerStyle, disableIcon, onPress, disablePress, outerContainerStyle, iconColor, iconSize } = this.props;
        console.warn(JSON.stringify(Icon))
        return (
            <TouchableOpacity
                onPress={onPress}
                disabled={disablePress}
                style={outerContainerStyle}
            >
                <View style={[styles.container, containerStyle]}>
                    <Text style={[styles.title, titleStyle]}>
                        {title}
                    </Text>
                    <View style={styles.rightContent}>
                        <Text style={[styles.value, style]}>
                            {value}
                        </Text>
                        { !disableIcon ?
                          <Icon name="icon_jiantou" size={iconSize} color={iconColor} /> :
                          null
                        }
                    </View>
                </View>
            </TouchableOpacity>
        );
    }
}


const styles = StyleSheet.create({
    container: {
        height: 50,
        alignItems: 'center',
        flexDirection: 'row',
        justifyContent: 'space-between',
        paddingLeft: 20,
        paddingRight: 15,
        backgroundColor: 'white',
    },
    title: {
        fontSize: 14,
        color: '#666666',
        width: 74,
        backgroundColor: 'transparent',
    },
    rightContent: {
      alignItems: 'center',
      flexDirection: 'row',
      flex: 1,
    },
    value: {
        // fontSize: normalize(14),
        fontSize: 13,
        color: '#333333',
        backgroundColor: 'transparent',
        flex: 1,
    },
});

module.exports = LabelBar;
